<!DOCTYPE html>
<html>

<head>
	<title id="page_title"></title>
	<meta name="referrer" content="strict-origin-when-cross-origin">
	<meta name="viewport"
		content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">


	<script type="text/javascript" src="liveplayer-element.min.js"></script>

	<script src="js/jquery.min.js"></script>

	<link rel="stylesheet" href="css/animsition.css">
	<link rel="stylesheet" href="css/index1920.css">
	<link rel="stylesheet" href="css/indexmin1920.css">
	<link rel="stylesheet" href="css/scanboard.css">
	<link rel="stylesheet" href="css/fb.css">
	<script src="Sovit3DPaser.min.js"></script>
	<script src="SovitChartPaser.min.js"></script>

	<!-- <script src="js/md5.js"></script> -->



	<script src="js/echarts@5.2.0.js"></script>
	<!-- <script src="js/echarts.min.js"></script> -->

	<!-- <script src="js/echarts-gl.js"></script> -->

	<script src="js/time.js"></script>
	<script src="js/panduan.js"></script>


	<script>
		$(function () {


			document.getElementById("mainhtmlId").style.height = (document.documentElement.clientHeight - 40) + 'px';
			document.getElementById("mainhtmlId").style.width = (document.documentElement.clientWidth - 40) + 'px';

		})
	</script>

</head>

<body style="overflow: hidden;margin: 0px;background-color: rgb(1,13,33);">
	<div style="position: absolute;margin: 30px;" id="mainhtmlId">

	</div>
	<div style="height: 60px;width:100%;position: absolute;z-index: 999;text-align: center;margin-top: 30px;">
		<div style="color: aqua;font-size: 32px;display: inline-block;letter-spacing: 2px;">智慧可视化系统</div>
		<img src="./title.png" alt="" srcset="" style="width: 100%;margin-top: -20px;">
	</div>
	<div class="sovitjs_body">
		<div class="div1">
			<div class="divgg" style="text-align: center;">
				<div class="left_title1">总览</div>
				<div id="mainCharts" style="width:160px;height: 220px;display: inline-block;">
				</div>
				<div id="mainCharts2" style="width:160px;height: 220px;display: inline-block;">
				</div>
			</div>


			<div class="divgg2" style="text-align: center;">
				<div class="left_title1">视频监控</div>
				<div style="display: flex;display: flex;justify-content: space-between">
					<img src="./videoeye.png" alt=""
						style="width:180px;height: 180px;text-align: center;position: relative;">
					<div style="right: 60px;top: 20px;height: 200px;position: relative;">
						<div style="color: #ffff;">摄像头总数</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;" id="num1"></div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
						<div style="color: #ffff;">故障设备数量</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;" id="num2"></div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
					</div>
				</div>
			</div>

		</div>
		<div class="div2">
			<div class="divgg" style="text-align: center;" id="lightningwarningpId">
				<div class="left_title1">雷电预警</div>
				<div style="display: flex;justify-content: space-between">
					<img src="./images/ld4.png" alt="" id="lightningwarningId" onclick="cliclCommonImgld()"
						style="width:100px;height: 100px;text-align: center;margin-top: 40px;margin-left: 60px;">
					<div style="right: 60px;top: 20px;height: 200px;position: relative;">
						<div style="color: #ffff;">雷电均值</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;" id="num3"></div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							KV/m</div>
						<div style="color: #ffff;">雷电强度</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;" id="num4"></div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							KV/m</div>
					</div>
				</div>

			</div>
			<div class="divgg2" style="text-align: center;" id="PipelineleakdetectionpId">
				<div class="left_title1">管道测漏</div>
				<div style="display: flex;justify-content: space-between">
					<img src="./images/left1.png" alt="" id="PipelineleakdetectionId" onclick="guandaochelouClass()"
						style="width:100px;height: 100px;text-align: center;margin-top: 40px;margin-left: 60px;">
					<div style="right: 60px;top: 30px;height: 200px;position: relative;">
						<div style="color: #ffff;">系统状态</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;">正常</div>
						<div style="height: 20px;">
						</div>
						<div style="color: #ffff;">报警数量</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;">0</div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
					</div>
				</div>
			</div>


		</div>
		<div class="div3">
			<div class="divgg" style="text-align: center;" id="FireProtectionSystempId">
				<div class="left_title1">消防系统</div>
				<div style="display: flex;justify-content: space-between">
					<img src="./images/left2.png" id="FireProtectionSystemId" alt="" onclick="xiaofangSysClass()"
						style="width:100px;height: 100px;text-align: center;margin-top: 40px;margin-left: 60px;">
					<div style="right: 60px;top: 30px;height: 200px;position: relative;">
						<div style="color: #ffff;">系统状态</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;">正常</div>
						<div style="height: 20px;">
						</div>
						<div style="color: #ffff;">报警数量</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;">0</div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
					</div>
				</div>
			</div>

			<style>
				.filterbg4 {
					width: 100%;
					height: 100%;
					/* background: rgba(30,182,254,0.5); */
					position: absolute;
					top: 0;
					left: 0;
					z-index: 998;
					display: none;
				}

				.popup4 {
					width: 0;
					height: 0;
					background: #061f3e;
					position: absolute;
					top: 50%;
					left: 50%;
					z-index: 999;
					border-radius: 8px;
					display: none;
					-webkit-transform: translate(-50%, -50%);
					-moz-transform: translate(-50%, -50%);
					-ms-transform: translate(-50%, -50%);
					-o-transform: translate(-50%, -50%);
					transform: translate(-50%, -50%);
				}

				.popup4 .popupClose4 {
					display: block;
					width: 44px;
					height: 44px;
					background-image: url(./images/s_ico3close.png);
					background-size: 100 100%;
					position: absolute;
					top: -22px;
					right: -22px;
					display: none;
					transition: 0.3s;
				}

				.popup4 .popupClose4:hover {
					transform: rotate(180deg);
				}




				.filterbg5 {
					width: 100%;
					height: 100%;
					/* background: rgba(30,182,254,0.5); */
					position: absolute;
					top: 0;
					left: 0;
					z-index: 998;
					display: none;
				}

				.popup5 {
					width: 0;
					height: 0;
					background: #061f3e;
					position: absolute;
					top: 50%;
					left: 50%;
					z-index: 999;
					border-radius: 8px;
					display: none;
					-webkit-transform: translate(-50%, -50%);
					-moz-transform: translate(-50%, -50%);
					-ms-transform: translate(-50%, -50%);
					-o-transform: translate(-50%, -50%);
					transform: translate(-50%, -50%);
				}

				.popup5 .popupClose5 {
					display: block;
					width: 44px;
					height: 44px;
					background: url(../s_ico3.png);
					background-size: 100 100%;
					position: absolute;
					top: -22px;
					right: -22px;
					display: none;
					transition: 0.3s;
				}

				.popup5 .popupClose5:hover {
					transform: rotate(180deg);
				}


				.filterbg6 {
					width: 100%;
					height: 100%;
					/* background: rgba(30,182,254,0.5); */
					position: absolute;
					top: 0;
					left: 0;
					z-index: 998;
					display: none;
				}

				.popup6 {
					width: 0;
					height: 0;
					background: #061f3e;
					position: absolute;
					top: 50%;
					left: 50%;
					z-index: 999;
					border-radius: 8px;
					display: none;
					-webkit-transform: translate(-50%, -50%);
					-moz-transform: translate(-50%, -50%);
					-ms-transform: translate(-50%, -50%);
					-o-transform: translate(-50%, -50%);
					transform: translate(-50%, -50%);
				}

				.popup6 .popupClose6 {
					display: block;
					width: 44px;
					height: 44px;
					background: url(../s_ico3.png);
					background-size: 100 100%;
					position: absolute;
					top: -22px;
					right: -22px;
					display: none;
					transition: 0.3s;
				}

				.popup6 .popupClose6:hover {
					transform: rotate(180deg);
				}


				.filterbg7 {
					width: 100%;
					height: 100%;
					/* background: rgba(30,182,254,0.5); */
					position: absolute;
					top: 0;
					left: 0;
					z-index: 998;
					display: none;
				}

				.popup7 {
					width: 0;
					height: 0;
					background: #061f3e;
					position: absolute;
					top: 50%;
					left: 50%;
					z-index: 999;
					border-radius: 8px;
					display: none;
					-webkit-transform: translate(-50%, -50%);
					-moz-transform: translate(-50%, -50%);
					-ms-transform: translate(-50%, -50%);
					-o-transform: translate(-50%, -50%);
					transform: translate(-50%, -50%);
				}

				.popup7 .popupClose7 {
					display: block;
					width: 44px;
					height: 44px;
					background: url(../s_ico3.png);
					background-size: 100 100%;
					position: absolute;
					top: -22px;
					right: -22px;
					display: none;
					transition: 0.3s;
				}

				.popup7 .popupClose7:hover {
					transform: rotate(180deg);
				}
			</style>

			<!-- <div class="divggs" style="text-align: center;">
				<div class="left_title1">存储(视频)</div>
				<div id="left_charts5" class="left_chartthree" style="height: 280px;">
				</div>
			</div> -->
			<div class="divgg2" style="text-align: center;" id="GaspId">
				<div class="left_title1">可燃气体</div>
				<div style="display: flex;justify-content: space-between">
					<img src="./images/left3.png" alt="" id="GasId" onclick="kerqitiClass()"
						style="width:100px;height: 100px;text-align: center;margin-top: 40px;margin-left: 60px;">
					<div style="right: 60px;top: 30px;height: 200px;position: relative;">
						<div style="color: #ffff;">系统状态</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;">正常</div>
						<div style="height: 20px;">
						</div>
						<div style="color: #ffff;">报警数量</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;">0</div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
					</div>
				</div>
			</div>
		</div>
		<div class="div4">
			<!-- <div class="divgg" style="text-align: center;">
				<div class="left_title1">流量统计(视频)</div>
				<div id="left_charts3" class="left_chartthree">
				</div>
			</div> -->
			<div class="divgg" style="text-align: center;" id="AutomaticcontrolsystempId">
				<div class="left_title1">自控系统</div>
				<!-- <div id="left_charts6" class="left_chartthree" style="margin-top: 20px;">
					<marquee direction="up" behavior="scroll" scrollamount="15" id="meagrs" scrolldelay="500"
						height="230">
					</marquee>
				</div> -->
				<div style="display: flex;justify-content: space-between">
					<img src="./images/left4.png" alt="" id="AutomaticcontrolsystemId" onclick='autoClassclick()'
						style="width:100px;height: 100px;text-align: center;margin-top: 40px;margin-left: 60px;">
					<div style="right: 60px;top: 30px;height: 200px;position: relative;">
						<div style="color: #ffff;">系统状态</div>
						<div style="height: 10px;"></div>
						<div style="color:aqua;display: inline-block;">正常</div>
						<div style="height: 20px;">
						</div>
						<div style="color: #ffff;">报警数量</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;">0</div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
					</div>
				</div>
			</div>
			<div class="divgg2" style="text-align: center;">
				<div class="left_title1">ESD系统</div>
				<div style="display: flex;justify-content: space-between">
					<img src="./images/left5.png" alt="" onclick="ESDSyetemClass()"
						style="width:100px;height: 100px;text-align: center;margin-top: 40px;margin-left: 60px;">
					<div style="right: 60px;top: 30px;height: 200px;position: relative;">
						<div style="color: #ffff;">系统状态</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;">异常</div>
						<div style="height: 20px;">
						</div>
						<div style="color: #ffff;">报警数量</div>
						<div style="height: 10px;"></div>
						<div style="color:red;display: inline-block;">274</div>
						<div
							style="height: 20px;display: inline-block;color: #fff;margin-left: 20px;margin-bottom: 20px;">
							个</div>
					</div>
				</div>
			</div>



		</div>

		<!-- <div id="main_div">
			<div id="theLeftDiv"> -->
		<div id="sovit3d_1">
		</div>
		<!-- </div>
		</div> -->

		<div class="divgg2"
			style="text-align: center;position: absolute;bottom: 10px;width: 850px;height: 430px;left: 10px;">
			<div class="left_title1" style="padding-top: 42px;">业务系统</div>
			<img src="./ywu.png" alt="" srcset="" style="margin-top: 60px;">
			<div style="display: flex;margin-left:200px;margin-top: 20px;">
				<div style="color: aqua;">施工车辆</div>
				<div style="color: aqua;padding-left: 120px;">施工人员</div>
				<div style="color: aqua;padding-left: 120px;">管理人员</div>
			</div>
			<div style="display: flex;margin-left:200px;margin-top: 20px;">
				<div style="color: #fff;font-size: 24px;">0</div>
				<div style="color: aqua;margin-left: 20px;margin-top: 8px;">辆</div>

				<div style="color: #fff;font-size: 24px;padding-left: 140px;">0</div>
				<div style="color: aqua;margin-left: 20px;margin-top: 8px;">个</div>

				<div style="color: #fff;font-size: 24px;padding-left: 140px;">0</div>
				<div style="color: aqua;margin-left: 20px;margin-top: 8px;">个</div>

			</div>
		</div>

		<div
			style="width: 1200px;height: 400px;position: absolute;bottom: 80px;left: 1000px;background-image: url(./bottom.png); background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1" style="padding-bottom: 20px;padding-top: 32px;">报警列表</div>
				<div style="max-height: 550px;overflow: auto;" id="meagrsbaoj"></div>
			</div>
		</div>
		<!-- 
		<div class="btn_div">
			<div class="center_btn1" id="center_btn1"
				style="text-align: center;justify-content: center;align-items: center;display: flex;background-image: url(./btn2.png);">
				<div style="font-size: 24px;color: aqua;">总览</div>
			</div>
			<div class="center_btn2" id="center_btn2"
				style="text-align: center;justify-content: center;align-items: center;display: flex;cursor: pointer;">
				<div style="font-size: 24px;color: aqua;">视频管理</div>
			</div>

			<div class="center_btn3" id="center_btn3"
				style="text-align: center;justify-content: center;align-items: center;display: flex;cursor: pointer;">
				<div style="font-size: 24px;color: aqua;">设备管理</div>
			</div>

			<div class="center_btnbao" id="center_btnbaoId"
				style="text-align: center;justify-content: center;align-items: center;display: flex;cursor: pointer;">
				<div style="font-size: 24px;color: aqua;">报警联动</div>
			</div>
		</div> -->


		<div style="float: right;">
			<div style="width:300px;height: 50px;float: right;right: 40px;top: 30px;position: absolute;">
				<div id="time" style="font-size: 28px;color: aqua;width: 100%;height: 100%;" class="LEDFont"></div>
			</div>
			<!--雷电强度开始div-->

			<!--雷电强度结束div-->

			<div class="right_div3" style="right: 10px;">
				<div class="divggs" style="text-align: center;">
					<div class="left_title1" id="suijiText" style="padding-top: 42px;">报警监控</div>
					<div id="container4" style="position: absolute;top: 120px;left: 40px;width: 820px;">
					</div>
				</div>

			</div>
			<div class="divgg2"
				style="text-align: center;position: absolute;bottom: 10px;width: 900px;height: 430px;right: 10px;">
				<div class="left_title1" style="padding-top: 42px;">值班人员</div>

			</div>

			<style>
				.grid-item12 {
					float: left;
					width: 33.33%;
					/* height: 24.33% !important; */
					box-sizing: border-box;
					border: 1px dashed #00a65a;
					/* background-color: #00a65a; */
				}

				.grid-item1 {
					width: 100%;
					height: 100%;
					box-sizing: border-box;
					background-color: #00a65a;
				}
			</style>


		</div>
	</div>

	<style>
		.divggs {
			background-image: url(../bg3.png);
			background-size: 100% 100%;
			width: 900px;
			height: 885px;
			/* right: 100px; */
			/* position: absolute; */
			/* float: right; */
		}

		.right_div3 {
			position: absolute;
			z-index: 999;
			/* pointer-events: none; */
			cursor: pointer;
			margin-top: 140px;
			/* margin-right: 200px; */
			display: flex;
		}

		.right_div4 {
			z-index: 999;
			/* pointer-events: none; */
			cursor: pointer;
			/* margin-top: 140px; */
			bottom: 60px;
			/* display: flex; */
		}
	</style>

	<!-- 视频管理弹框页面开始div-->

	<div class="filterbg"></div>
	<div class="popup">
		<a href="javascript:;" class="popupClose"></a>
		<!-- 左侧菜单栏 -->
		<div class="menuTitle">
			<div style="text-align: center;">
				<div class="left_title1" style="margin-top: 20px;">视频监控列表</div>
			</div>
			<ul class="treeList" id="treeListid" style="max-height:760px !important;overflow: auto">

			</ul>
		</div>

		<!-- 视频容器 -->
		<div id="container">


		</div>
		<!-- 分屏切换按钮 -->
		<div class="switchToggle">
			<button id="toggle1">单屏</button>
			<button id="toggle4">四分屏</button>
			<button id="toggle6">六分屏</button>
			<button id="toggle9">九分屏</button>
		</div>
	</div>

	<!-- 视频管理弹框页面结束div-->


	<!-- 报警联动弹框页面开始div-->

	<div class="filterbg2"></div>
	<div class="popup2">
		<a href="javascript:;" class="popupClose2"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1" id="diaLogId"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					雷电预警
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">

				<div style="margin-top:20px;width:100%;height: 80px;">
					<div style="display: inline-flex;position: absolute;float: right;right: 700px;">
						<img src="" alt="" srcset="" style="width: 110px;height: 110px;" id="wenduId">
						<div style="color: #fff;width:100px;margin-top: 20px;">
							<div id="currentWendu" style="font-size: 28px;"></div>
							<div id="currentWenduText" style="margin-top: 10px;"></div>
						</div>
					</div>
					<div style="display: inline-flex;display: inline-block;">
						<div style="float: right;right: 100px;color: #fff;font-size: 24px;position: absolute;"
							id="weatherobsTime"></div>

						<div style="float: right;right: 100px;color: #fff;font-size: 24px;position: absolute;margin-top: 40px;"
							id="weatherairf"></div>
					</div>

				</div>


				<div style="margin-top:30px;width:100%;height: 100px;display: flex;">
					<div class="commonfoot">
						<div style="margin-bottom: 10px;" id="commonfoot1"></div>
						<div id="commonfoot1_1"></div>
					</div>
					<div class="commonfoot">
						<div style="margin-bottom: 10px;" id="commonfoot2"></div>
						<div>相对湿度</div>
					</div>
					<div class="commonfoot">
						<div style="margin-bottom: 10px;" id="commonfoot3"></div>
						<div>体感温度</div>
					</div>
					<div class="commonfoot">
						<div style="margin-bottom: 10px;" id="commonfoot4"></div>
						<div>能见度</div>
					</div>
					<div class="commonfoot">
						<div style="margin-bottom: 10px;" id="commonfoot5"></div>
						<div>降雨量</div>
					</div>
					<div class="commonfoot">
						<div style="margin-bottom: 10px;" id="commonfoot6"></div>
						<div>大气压</div>
					</div>
				</div>

				<div style="margin-top:40px;width:100%;height: 300px;display: flex;">
					<div style="width:50%;height: 100%;" id="diaMainChartWeather"></div>
					<div style="width: 48%;height: 100%;background-color:rgba(0, 0, 0, 0.5);margin-right: 20px;">
						<div style="text-align: center;margin-top: 80px;" id="warningnoData">
							<img src="./images/warning-no-data.png" alt="" srcset="" style="width:100px;height: 100px;">
							<div style="color: #fff;font-size: 26px;">
								暂无预警
							</div>
						</div>
						<div id="warningyesData" style="text-align: center;color: #fff;">
							<div id="diaright_1" style="font-size: 26px;margin-top: 60px;margin-bottom: 20px;">
							</div>
							<div id="diaright_2" style="margin-bottom: 20px;">

							</div>
							<div id="diaright_3" style="font-size: 22px;"></div>
							<div id="diaright_4" style="font-size: 22px;"></div>

						</div>
					</div>
				</div>

			</div>
		</div>

		<style>
			.commonfoot {
				width: 15%;
				height: 100%;
				background-color: rgba(0, 0, 0, 0.5);
				margin-left: 24px;
				text-align: center;
				font-size: 26px;
				color: #fff;
			}

			.popclass {
				width: 570px;
				height: 300px;
				margin: 50px;
				background-image: url(./diabg.png);
				background-repeat: no-repeat;
				background-size: 100% 100%;
			}
		</style>

	</div>

	<!-- 报警联动弹框页面结束div-->

	<!-- 2号罐子弹框页面开始div-->

	<div class="filterbg3"></div>
	<div class="popup3">
		<a href="javascript:;" class="popupClose3"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1" id="diaLogId3"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					管道测漏
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">
				<div style="display: flex;">
					<div style="width: 50%;height: 400px;">
						<div style="color: #fff;padding-top: 100px;position: absolute;display: flex;">
							<div style="margin-left: 160px;">高桥油库</div>
							<div style="margin-left: 400px;">浦东油库</div>
						</div>
						<div style="position: absolute;width:200px;height: 150px;margin-left: 250px;margin-top: 120px;">
							<div style="color: #fff;display: flex;">
								<div style="border: 1px solid #fff;width: 80px;" id="gaoqiaoyoukunliuliang1">1.00</div>
								<div style="margin-left: 10px;">m3/h</div>
							</div>

							<div style="color: #fff;display: flex;margin-top: 20px;">
								<div style="border: 1px solid #fff;width: 80px;" id="gaoqiaoyoukunyali1">1.00</div>
								<div style="margin-left: 10px;">Mpa</div>
							</div>

							<div style="color: #fff;display: flex;margin-top: 20px;">
								<div style="border: 1px solid #fff;width: 80px;" id="gaoqiaoyoukunwendu1">1.00</div>
								<div style="margin-left: 10px;">℃</div>
							</div>
						</div>

						<div style="position: absolute;width:200px;height: 150px;margin-left: 480px;margin-top: 120px;">
							<div style="color: #fff;display: flex;">
								<div style="border: 1px solid #fff;width: 80px;" id="pudongyoukunliuliang1">1.00</div>
								<div style="margin-left: 10px;">m3/h</div>
							</div>

							<div style="color: #fff;display: flex;margin-top: 20px;">
								<div style="border: 1px solid #fff;width: 80px;" id="pudongyoukunyali1">1.00</div>
								<div style="margin-left: 10px;">Mpa</div>
							</div>

							<div style="color: #fff;display: flex;margin-top: 20px;">
								<div style="border: 1px solid #fff;width: 80px;" id="pudongyoukunwendu1">1.00</div>
								<div style="margin-left: 10px;">℃</div>
							</div>
						</div>
						<img src="./images/guandaocel2.png" alt="" srcset="" style="width: 80%;height: 100%;">
					</div>
					<div>

					</div>
					<div style="width: 50%;height: 280px;position: absolute;float: right;right: 60px;">
						<div style="width: 100%;height: 100%;" id="getguandaochelouChartId6"></div>
					</div>
				</div>

				<div style="display: flex;">

					<div style="width: 50%;height: 300px;">
					</div>

					<div style="width: 50%;height: 280px;position: absolute;float: right;right: 60px;">
						<div style="width: 100%;height: 100%;margin-top: -100px;" id="getguandaochelouChartId4"></div>
					</div>
				</div>

				<div style="display: flex;">
					<div style="width: 50%;height: 300px;color: #fff;margin-top: -200px;">
						<div style="width:100%;height: 300px;margin-left: 80px;text-align: center;">
							<div class="gaundaoClassshaoa">
								<div style="color: #fff;width: 200px;height: 100%;">
									<div style="text-align: center;margin-top: 20px;">管线状态</div>
									<div style="width:100%;height: 200px;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px;margin-left: 20px; ">
										<div style="padding-top: 30px;">
											<div style="width:80px;float: left;">管线状态</div>
											<div
												style="border: 1px solid #fff;float: right;margin-right: 20px; width: 100px;">
												运行
											</div>
										</div>
										<div style="padding-top: 52px;">
											<div style="width:80px;float: left;">输送油品</div>
											<div
												style="border: 1px solid #fff;float: right;margin-right: 20px;width: 100px;">
												JETA-1
											</div>
										</div>

										<div style="padding-top: 52px;">
											<div style="width:80px;float: left;">泄露状态</div>
											<div
												style="border: 1px solid #fff;float: right;margin-right: 20px;width: 100px;">
												正常
											</div>
										</div>
									</div>
								</div>
								<div style="color: #fff;width: 240px;height: 100%;margin-left: 10px;">
									<div style="text-align: center;margin-top: 20px;">泄露数据</div>
									<div style="width:100%;height: 200px;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px;margin-left: 20px; ">
										<div style="padding-top: 30px;display: flex;">
											<div style="width:80px;float: left;">瞬时流量差</div>
											<div id="suanshiliuliangchaId"
												style="border: 1px solid #fff;float: right;margin-left: 10px; width: 80px;">
												1.00
											</div>
											<div style="margin-left: 20px">m3/h</div>
										</div>
										<div style="padding-top: 30px;display: flex;">
											<div style="width:80px;float: left;">泄露量</div>
											<div id="suanshiliuliangchaId2"
												style="border: 1px solid #fff;float: right;margin-left: 10px; width: 80px;">
												1.00
											</div>
											<div style="margin-left: 20px">m3</div>
										</div>

										<div style="padding-top: 30px;display: flex;">
											<div style="width:80px;float: left;">泄露积累量</div>
											<div id="suanshiliuliangchaId3"
												style="border: 1px solid #fff;float: right;margin-left: 10px; width: 80px;">
												1.00
											</div>
											<div style="margin-left: 20px">m3</div>
										</div>
									</div>
								</div>
								<div style="color: #fff;width: 200px;height: 100%;">
									<div style="text-align: center;margin-top: 20px;">系统状态</div>
									<div style="width:100%;height: 200px;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px;margin-left: 20px; ">
										<div style="padding-top: 30px;">
											<div style="width:80px;float: left;">系统状态</div>
											<div
												style="border: 1px solid #fff;float: right;margin-right: 20px; width: 100px;">
												正常
											</div>
										</div>
										<div style="padding-top: 52px;">
											<div style="width:80px;float: left;">仪表状态</div>
											<div
												style="border: 1px solid #fff;float: right;margin-right: 20px;width: 100px;">
												正常
											</div>
										</div>
										<div style="padding-top: 52px;">
											<div style="width:80px;float: left;">通信状态</div>
											<div id="tongxinzhuangtaiId"
												style="border: 1px solid #fff;float: right;margin-right: 20px;width: 100px;">
												正常
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>

					<style>
						.gaundaoClassshaoa {
							width: 80%;
							height: 90%;
							display: flex;
							background-color: rgba(0, 0, 0, 0.5);
							border-top: 1px solid #fff;
							border-left: 1px solid #fff;
							box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);
						}
					</style>

					<div style="width: 50%;height: 280px;position: absolute;float: right;right: 60px;">
						<div style="width: 100%;height: 100%;margin-top: -100px;" id="getguandaochelouChartId2"></div>
					</div>
				</div>

			</div>
		</div>
	</div>



	<!-- 2号罐子弹框页面结束div-->
	<div class="filterbg4"></div>
	<div class="popup4">
		<a href="javascript:;" class="popupClose4"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div
					style="display: flex;height: 80px;position: absolute;left: 60px;color: #fff;font-size: 22px;top:30px">
					<img src="./images/xioafangbaoj.png" alt="" srcset="" style="width: 40px;height: 40px;">
					<div>报警状态:</div>
					<div style="margin-left: 10px;" id="xiaofangbaojiid41"></div>
				</div>
				<div class="left_title1"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					消防系统
				</div>
				<div
					style="display: flex;height: 80px;position: absolute;right: 40px;color: #fff;font-size: 22px;top: 20px;">
					<div>稳压装置:</div>
					<div id="filterbg8dcqdidxiaofang1"></div>
					<div style="margin-left: 20px;">混合装置:</div>
					<div id="filterbg8dcqdidxiaofang2"></div>

				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">

				<div style="position: absolute;color: #fff;font-size: 22px;left:650px;top: 340px;">
					常规数据报警
				</div>

				<div style="width: 400px;height: 320px;position: absolute;top: 400px;left:80px;">
					<div style="width: 100%;height: 320px;" id="xiaofangSysdiaId5"></div>
				</div>
				<div style="width: 400px;height: 320px;position: absolute;top: 400px;left:480px;">
					<div style="width: 100%;height: 320px;" id="xiaofangSysdiaId6"></div>
				</div>
				<div style="width: 400px;height: 320px;position: absolute;top: 400px;left:880px;">
					<div style="width: 100%;height: 320px;" id="xiaofangSysdiaId7"></div>
				</div>

				<div style="position: absolute;color: #fff;font-size: 22px;right:350px;top: 340px;">
					联动监控
				</div>
				<div style="height: 40px;width: 60px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);position: absolute;right: 40px;top: 340px;
				color: #fff;font-size: 22px;cursor: pointer;" onclick="clickTogglecommvidoexiaofang(8)">
					全景
				</div>
				<div style="position: absolute;right:50px;width: 550px;border: 1px solid darkseagreen;top:400px;">
					<live-player video-url="http://58.33.201.244:10801/hls/stream_146/live.m3u8" live="true"
						stretch="true"></live-player>
				</div>
			</div>
		</div>

		<div style="position: absolute;left: 320px;top: 140px;">

			<div style="width: 220px;height: 220px;position: absolute;left: 40px;" id="echartsxiaofangdaping1">
			</div>
			<div style="width: 220px;height: 220px;position: absolute;left: 250px;" id="echartsxiaofangdaping2">
			</div>
			<div style="width: 220px;height: 220px;position: absolute;left: 460px;" id="echartsxiaofangdaping3">
			</div>
			<div style="width: 220px;height: 220px;position: absolute;left: 660px;" id="echartsxiaofangdaping4">
			</div>
			<div style="width: 220px;height: 220px;position: absolute;left: 870px;" id="echartsxiaofangdaping5">
			</div>
			<div style="width: 220px;height: 220px;position: absolute;left: 1060px;" id="echartsxiaofangdaping6">
			</div>
			<div style="width: 220px;height: 220px;position: absolute;left: 1240px;" id="echartsxiaofangdaping7">
			</div>
		</div>

		<div
			style="height:280px;position: absolute;right: 800px;bottom: 40px;color: #fff;font-size: 22px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);">
			<div style="display: flex;margin-top: 20px;">
				<div style="margin-left: 10px;"> 灭火联动:</div>
				<div id="filterbg8dcqdidxiaofang3"></div>
			</div>
			<div style="display: flex;margin-top: 20px;">
				<div style="margin-left: 10px;">喷淋联动:</div>
				<div id="filterbg8dcqdidxiaofang4"></div>
			</div>
			<div style="display: flex;margin-top: 20px;">
				<div style="margin-left: 10px;">泡沫联动:</div>
				<div id="filterbg8dcqdidxiaofang5"></div>
			</div>
			<div style="display: flex;margin-top: 20px;">
				<div style="margin-left: 10px;">阀门测试:</div>
				<div id="filterbg8dcqdidxiaofang6"></div>
			</div>
			<div style="display: flex;margin-top: 20px;">
				<div style="margin-left: 10px;">水泵测试:</div>
				<div id="filterbg8dcqdidxiaofang7"></div>
			</div>
		</div>

		<div style="position: absolute;color: #fff;font-size: 22px;right:350px;bottom: 340px;">
			报警列表
		</div>
		<div
			style="background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);width: 700px;height: 280px;bottom: 40px;right: 50px;position: absolute;">
			<marquee height="280" direction="up" scrolldelay="500">
				<div style="max-height: 280px;overflow: hidden;" id="meagrsbaoj1haodialog2"></div>
			</marquee>
		</div>
		<div style="position: absolute;color: #fff;font-size: 22px;left:580px;bottom: 340px;">
			消防控制柜示意图
		</div>

		<div style="height: 280px;width: 1200px;position: absolute;bottom: 40px;left: 80px;" id="xiaofangfaguanids">

		</div>


	</div>


	<div class="filterbg5"></div>
	<div class="popup5">
		<a href="javascript:;" class="popupClose5"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					可燃气体
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">
				<div style="display: flex;">
					<div
						style="height: 660px;width:350px;background-color: rgba(0, 0, 0, 0.5);margin-left: 10px;box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;">
						<div style="width:100%;height: 100%;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px; " id="kerqitidiaLogId">
						</div>
					</div>
					<div
						style="height: 660px;width:350px;background-color: rgba(0, 0, 0, 0.5);margin-left: 20px;box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;">
						<div style="width:100%;height: 100%;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px; " id="kerqitidiaLogId2">
						</div>
					</div>


					<div style="width: 320px;height: 380px;margin-left: 20px;margin-top: 80px;" id="kerqitidiaChartsId">

					</div>

					<div
						style="height: 660px;width:350px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;float: right;right: 10px;position: absolute;">
						<div style="width:100%;height: 100%;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px; " id="kerqitidiaLogId3">
						</div>
					</div>

					<div
						style="height: 660px;width:350px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;float: right;right: 380px;position: absolute;">
						<div style="width:100%;height: 100%;
									box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);margin-top: 20px; " id="kerqitidiaLogId4">
						</div>
					</div>
				</div>


			</div>
		</div>
	</div>


	<div class="filterbg6"></div>
	<div class="popup6">
		<a href="javascript:;" class="popupClose6"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					自控系统
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">
				<div style="display: flex;">
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId">
						</div>
					</div>

					<style>
						.zikongxitongClass1 {
							height: 960px;
							width: 250px;
							background-color: rgba(0, 0, 0, 0.5);
							margin-left: 10px;
							box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);
							color: #fff;
						}

						.zikongxitongClass2 {
							width: 100%;
							height: 100%;
							box-shadow: inset -4px -4px 8px rgba(0, 0, 0, 0.6);
							margin-top: 20px;
						}
					</style>
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId2">
						</div>
					</div>
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId3">
						</div>
					</div>
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId4">
						</div>
					</div>

					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId5">
						</div>
					</div>
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId6">
						</div>
					</div>
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId7">
						</div>
					</div>

					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId8">
						</div>
					</div>
					
					<div class="zikongxitongClass1">
						<div class="zikongxitongClass2" id="autokongzhiId9">
						</div>
					</div>
				</div>

			</div>
		</div>
	</div>

	<div class="filterbg7"></div>
	<div class="popup7">
		<a href="javascript:;" class="popupClose7"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					ESD系统
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">
			</div>
		</div>
	</div>

	<style>
		.LEDFont {
			font-family: 'LEDFont';
			font-size: 32px;
		}

		@font-face {
			font-family: 'LEDFont';

			src: url('./font/UnidreamLED.ttf');
		}
	</style>

	<div class="filterbg8"></div>
	<div class="popup8">
		<a href="javascript:;" class="popupClose8" onclick="clickpopupClose8()"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1"
					style="display: inline-block;text-align: center;margin-top: 50px;font-size: 22px;position: absolute;left:1000px;">
					1号储油罐
				</div>
				<div
					style="display: flex;width: 600px;height: 80px;position: absolute;left: 60px;color: #fff;font-size: 22px;top:30px">
					<img src="./images/xioafangbaoj.png" alt="" srcset="" style="width: 40px;height: 40px;">
					<div>消防报警:</div>
					<div style="margin-left: 10px;" id="xiaofangbaojiid"></div>
				</div>
				<div
					style="display: flex;width: 600px;height: 80px;position: absolute;right: 20px;color: #fff;font-size: 22px;margin-top: 30px;">
					<div>电场强度:</div>
					<div id="filterbg8dcqdid1" class="LEDFont"></div>
					<div style="margin-left: 20px;">电场均场值:</div>
					<div id="filterbg8dcqdid2" class="LEDFont"></div>
					<div style="margin-left: 20px;">电场变化率:</div>
					<div id="filterbg8dcqdid3" class="LEDFont"></div>
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;width: 100%;height: 100%;">
			</div>

			<div
				style="background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);border-left: 1px solid #000;border-top: 1px solid #000;width: 500px;height: 240px;margin-left: 40px;margin-top: -20px;">
				<div style="display: flex;margin-left: 10px;margin-top: 10px;">
					<div
						style="width:230px;height: 60px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;display: flex;font-size: 20px;">
						<img src="./images/switch.png" alt="" srcset="" style="width:40px;height: 40px;margin:10px;">
						<div style="margin-left: 10px;width: 130px;margin-top: 15px;">1#泡沫水阀</div>
						<div id="switchTag4" style="margin-top: 15px;width: 60px;"></div>
					</div>
					<div
						style="width:230px;height: 60px;margin-left: 20px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;display: flex;font-size: 20px;">
						<img src="./images/switch.png" alt="" srcset="" style="width:40px;height: 40px;margin:10px;">
						<div style="margin-left: 10px;width: 130px;margin-top: 15px;">2#泡沫水阀</div>
						<div id="switchTag6" style="margin-top: 15px;width: 60px;"></div>
					</div>

				</div>
				<div style="display: flex;margin-top: 20px;margin-left: 10px;">
					<div
						style="width:230px;height: 60px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;display: flex;font-size: 20px;">
						<img src="./images/switch.png" alt="" srcset="" style="width:40px;height: 40px;margin:10px;">
						<div style="margin-left: 10px;width: 130px;margin-top: 15px;">3#泡沫水阀</div>
						<div id="switchTag7" style="margin-top: 15px;width: 60px;"></div>
					</div>
					<div
						style="width:230px;height: 60px;;margin-left: 20px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;display: flex;font-size: 20px;">
						<img src="./images/switch.png" alt="" srcset="" style="width:40px;height: 40px;margin:10px;">
						<div style="margin-left: 10px;width: 130px;margin-top: 15px;">1#冷却水阀</div>
						<div id="switchTag5" style="margin-top: 15px;width: 60px;"></div>
					</div>
				</div>
				<div style="display: flex;margin-top: 20px;margin-left: 10px;">
					<div
						style="width:230px;height: 60px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;display: flex;font-size: 20px;">
						<img src="./images/switch2.png" alt="" srcset="" style="width:40px;height: 40px;margin:10px;">
						<div style="margin-left: 10px;width: 130px;margin-top: 15px;">稳压装置</div>
						<div id="switchTag8" style="margin-top: 15px;width: 80px;"></div>
					</div>
					<div
						style="width:230px;height: 60px;;margin-left: 20px;background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);color: #fff;display: flex;font-size: 20px;">
						<img src="./images/switch2.png" alt="" srcset="" style="width:40px;height: 40px;margin:10px;">
						<div style="margin-left: 10px;width: 130px;margin-top: 15px;">混合装置</div>
						<div id="switchTag9" style="margin-top: 15px;width: 80px;"></div>
					</div>
				</div>

			</div>

		</div>


		<div style="position: absolute;left:700px;width: 700px;border: 1px solid darkseagreen;top:200px;">
			<live-player video-url="http://58.33.201.244:10801/hls/stream_83/live.m3u8" live="true"
				stretch="true"></live-player>
		</div>
		<div style="width: 600px;height: 0px;position: absolute;margin-left: 640px;bottom: 300px;z-index: 999999;">
			<div class="switchToggle">
				<button id="toggle1vidoe" onclick="clickTogglecommvidoe(2)">报警点1</button>
				<button id="toggle2vidoe" onclick="clickTogglecommvidoe(3)">报警点2</button>
				<button id="toggle3vidoe" onclick="clickTogglecommvidoe(4)">报警点3</button>
				<button id="toggle3vidoe" onclick="clickTogglecommvidoe(1)">全景</button>
			</div>
		</div>


		<div style="width:500px;height: 260px;position: absolute;bottom: 300px;margin-left: 40px;z-index: 999999;"
			id="inti3Dechratinfo1">
		</div>
		<div style="width:500px;height: 260px;position: absolute;bottom: 20px;margin-left: 40px;z-index: 999999;"
			id="inti3Dechratinfo2">
		</div>

		<div
			style="background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);width: 900px;height: 280px;bottom: 20px;margin-left: 580px;position: absolute;">
			<div style="max-height: 280px;overflow: hidden;" id="meagrsbaoj1haodialog"></div>
		</div>
		<div style="width:250px;height: 260px;position: absolute;bottom: 20px;right: 300px;z-index: 999999;"
			id="inti3Dechratinfo3">
		</div>
		<div style="width:250px;height: 260px;position: absolute;bottom: 20px;right: 40px;z-index: 999999;"
			id="inti3Dechratinfo4">
		</div>
		<div style="width:500px;height: 260px;position: absolute;bottom: 300px;right: 40px;z-index: 999999;"
			id="inti3Dechratinfo5">
		</div>

		<div
			style="background-color: rgba(0, 0, 0, 0.5);box-shadow: 15px 0px 15px 0px rgba(0, 0, 0, 0.5);width: 500px;height: 300px;right: 40px;margin-top: 160px;position: absolute;color: #fff;">
			<div style="display: flex;">
				<div style="margin-left: 10px;width: 130px;margin-top: 15px;">可燃气体:</div>
				<div id="switchTagkerqitiId" style="margin-top: 15px;width: 60px;"></div>
			</div>
			<div style="display: flex;">
				<div style="margin-left: 10px;width: 130px;margin-top: 15px;">温度:</div>
				<div id="switchTagwenduId" style="margin-top: 15px;width: 60px;"></div>
			</div>
			<div style="display: flex;">
				<div style="margin-left: 10px;width: 130px;margin-top: 15px;">液位:</div>
				<div id="switchTagyeweiId" style="margin-top: 15px;width: 60px;"></div>
			</div>
			<div style="display: flex;">
				<div style="margin-left: 10px;width: 130px;margin-top: 15px;">检验单号:</div>
				<div id="switchTagjiaoyanbianhaoId" style="margin-top: 15px;width: 60px;"></div>
			</div>
			<div style="display: flex;">
				<div style="margin-left: 10px;width: 130px;margin-top: 15px;">沉降时间:</div>
				<div id="switchTagchenjishijianId" style="margin-top: 15px;width: 60px;"></div>
			</div>
		</div>


		<div style="display: flex;">
			<div id="onehaocunyouhguanId2" style="margin-top: 150px;">
			</div>
		</div>
	</div>

	<div class="filterbg9"></div>
	<div class="popup9">
		<a href="javascript:;" class="popupClose9"></a>
		<div style="width:100%;height: 40px;position: absolute;top: 20px; background-repeat: no-repeat;">
			<div style="text-align: center;">
				<div class="left_title1"
					style="display: inline-block;position: absolute;text-align: center;margin-left:560px;margin-top: 15px;font-size: 22px;">
					紧急报警
				</div>
				<img src="./bottom.png" alt="" style="display: inline-block;">
			</div>
		</div>
	</div>

	</div>
</body>
<style>
	#onehaocunyouhguanId2 {
		overflow: hidden !important;
		/* margin-left: 900px !important; */
		/* width: 1850px !important;
		height: 900px !important; */
		/* width: 550px !important;
		height: 600px !important; */
	}

	#sovit3d_scene_main_onehaocunyouhguanId2 {
		overflow: hidden !important;
	}

	#onehaocunyouhguanId2 canvas {
		overflow: hidden !important;
		position: absolute !important;
		left: 1250px !important;
		width: 1300px !important;
		height: 600px !important;
		top: -70px !important;
	}

	#sovit3d_1 canvas {
		/* margin-left: 900px !important; */
		/* width: 1850px !important;
		height: 900px !important; */
	}

	.filterbg3 {
		width: 100%;
		height: 100%;
		/* background: rgba(30,182,254,0.5); */
		position: absolute;
		top: 0;
		left: 0;
		z-index: 998;
		display: none;
	}

	.grid-item4 {
		float: left;
		width: 50%;
		height: 50% !important;
		box-sizing: border-box;
		border: 1px dashed black;
		background-color: #00a65a;
	}

	#dia1haovideolistId {
		position: absolute;
		/* top: 10%;
		left: 21%; */
		width: 100%;
		/* height: 100%; */
		/* height: 1000px; */
		border: 1px solid darkseagreen;
	}

	.popup3 {
		width: 0;
		height: 0;
		background: #061f3e;
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 999;
		border-radius: 8px;
		display: none;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}

	.popup3 .popupClose3 {
		display: block;
		width: 44px;
		height: 44px;
		background: url(../s_ico3.png);
		background-size: 100 100%;
		position: absolute;
		top: -22px;
		right: -22px;
		display: none;
		transition: 0.3s;
	}

	.popup3 .popupClose3:hover {
		transform: rotate(180deg);
	}


	.filterbg8 {
		width: 100%;
		height: 100%;
		/* background: rgba(30,182,254,0.5); */
		position: absolute;
		top: 0;
		left: 0;
		z-index: 998;
		display: none;
	}

	.popup8 {
		width: 0;
		height: 0;
		background: #061f3e;
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 999;
		border-radius: 8px;
		display: none;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		pointer-events: all;
	}

	.popup8 .popupClose8 {
		display: block;
		width: 44px;
		height: 44px;
		background: url(../s_ico3.png);
		background-size: 100 100%;
		position: absolute;
		top: -22px;
		right: -22px;
		display: none;
		transition: 0.3s;
	}

	.popup8 .popupClose8:hover {
		transform: rotate(180deg);
	}

	.filterbg9 {
		width: 100%;
		height: 100%;
		/* background: rgba(30,182,254,0.5); */
		position: absolute;
		top: 0;
		left: 0;
		z-index: 998;
		display: none;
	}

	.popup9 {
		width: 0;
		height: 0;
		background: #061f3e;
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 999;
		border-radius: 8px;
		display: none;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		pointer-events: all;
	}

	.popup9 .popupClose9 {
		display: block;
		width: 44px;
		height: 44px;
		background: url(../s_ico3.png);
		background-size: 100 100%;
		position: absolute;
		top: -22px;
		right: -22px;
		display: none;
		transition: 0.3s;
	}

	.popup9 .popupClose9:hover {
		transform: rotate(180deg);
	}


	#meagrsbaoj::-webkit-scrollbar {
		display: none !important;
	}
</style>

<script src="js/inti3D.js"></script>
<!-- <script src="js/onehaocunyouhguan.js"></script> -->
<script src="js/home.js"></script>
<script src="js/jquery.animsition.js"></script>

<script src="js/Utils.js"></script>
<script src="js/baojing.js"></script>
<script src="js/ldyj.js"></script>
<script src="js/gdcl.js"></script>
<script src="js/xiaofang.js"></script>
<script src="js/kerqiti.js"></script>
<script src="js/autoSystem.js"></script>
<script src="js/ESDSyetem.js"></script>

<script>

	function clickTogglecommvidoe(val) {
		$.ajax("http://58.33.201.244:10801/api/v1/gotopreset?channel=83&index=" + val, {
			method: 'GET',
			headers: {
				"content-type": "application/json",
			},
			success: function (result) {
				if (result.code == 200) {

				}
			},
			error: function (err) {
				console.log(err);
			}
		})
	}


	$(function () {
		addinit3DchartsData();
		setInterval(() => {
			addinit3DchartsData()
		}, 1000 * 30);


	})

	function addinit3DchartsData() {
		$.ajax("http://58.33.201.244:8091/dev-device-instance/getDeviceDataInfo", {
			method: 'GET',
			data: {
				id: "PDJCYHCG",
			},
			headers: {
				"Content-type": "application/json",
			},
			success: function (r) {

				if (r.code == 200) {
					adddstoreTankAudioNode(r.data.list.records[0])

				}
			},
			error: function (err) {
				console.log(err);
			}
		})
	}

	function adddstoreTankAudioNode(val) {
		var data = {
			tag1: val.Tag1,
			tag2: val.Tag2,
			tag3: val.Tag3,
			tag4: val.Tag4,
			tag5: val.Tag5,
			tag6: val.Tag6,
			tag7: val.Tag7,
			tag8: val.Tag8,
			tag9: val.Tag9,
			tag10: val.Tag10,
			tag11: val.Tag11,
			tag12: val.Tag12,
			tag13: val.Tag13,
			tag14: val.Tag14,
			tag15: val.Tag15,
			tag16: val.Tag16,
			tag17: val.Tag17,
			tag18: val.Tag18,
			tag19: val.Tag19,
			tag20: val.Tag20,
			tag21: val.Tag21,
			tag22: val.Tag22,
			tag23: val.Tag23,
			tag24: val.Tag24,
			tag25: val.Tag25,
			tag26: val.Tag26,
			tag27: val.Tag27,
			tag28: val.Tag28,
			tag29: val.Tag29,
		}
		$.ajax("http://192.168.15.10:8080/system/tank/add", {
			method: 'POST',
			data: JSON.stringify(data),
			headers: {
				"Content-type": "application/json",
			},
			success: function (r) {


			},
			error: function (err) {
				console.log(err);
			}
		})
	}

</script>

</html>

<style>
	/* 此处的 div 可以依照情况替换成对应的元素名称 */
	#treeListid::-webkit-scrollbar {
		display: none !important;
	}
</style>